<template>
	<view>
		<view class="showSavingPlanDetail_item">
			<!-- <view class="showSavingPlanDetail_item_title">
				存钱计划：{{savingTypeDetailOne.savePlan}}
			</view> -->
			<u-cell-group>
				<u-cell @click="toClockInFn" :border='false' :value="savingTypeDetailOne.avgMoeny+'元'"  size="large" :label="'已存入'+savingTypeDetailOne.hasMoney" :title="savingTypeDetailOne.savePlan" :isLink="true" arrow-direction="left"></u-cell>
					<u-line-progress class="saveProgress" :percentage="progress" activeColor="#FFC0CB"></u-line-progress>
			</u-cell-group>
		</view>

	</view>
</template>

<script>
	export default {
		name:"showSavingplan_item",
		data() {
			return {
				
			};
		},
		mounted() {
		},
		methods:{
			toClockInFn(data) {
				uni.navigateTo({
					url: `/pages/ClockIn/ClockIn?data=${encodeURIComponent(JSON.stringify(this.savingTypeDetailOne))}`
				})
			},
		},
		computed:{
			progress(){
				return Math.floor((this.savingTypeDetailOne.hasMoney/this.savingTypeDetailOne.avgMoeny)*100)
			},
		},
		props:['savingTypeDetailOne']
	}
</script>

<style scoped>
.showSavingPlanDetail_item{
		width: 100%;
		height: 200rpx;
		margin: 10rpx 0;
	}
.saveProgress{
	width: 600rpx;
	margin: 0px auto;
}
</style>